Intelligent systems and methods for producing a dynamic color combination for a design output

ABSTRACT

Inventive systems and methods for selecting color design elements. More specifically, the invention is directed to analyzing color-palette data elements for producing a color combination in a design output by mapping color-palette elements to objects or components in a design output or final artifact. Methods and systems for selecting and generating color-palette data elements for a software program such as for example visual representations, and producing executable software based at least in part on the color palette data selected and generated.

CROSS REFERENCE TO RELATED APPLICATIONS

This application is a continuation-in-part (CIP) application of U.S.application Ser. No. 15/702,718 entitled “INTELLIGENT SYSTEMS ANDMETHODS FOR DYNAMIC COLOR HIERARCHY & AESTHETIC DESIGN COMPUTATION”filed Sep. 12, 2017. The content of this application is herebyincorporated by reference in its entirety.

FIELD OF THE INVENTION

The invention is directed to systems and methods for selecting colordesign elements. More specifically, the invention is directed toanalyzing color-palette data elements for producing a color combinationin a design output by mapping color-palette elements to objects orcomponents in a design output or final artifact. Methods and systems forselecting and generating color-palette data elements for a softwareprogram such as for example visual representations, and producingexecutable software based at least in part on the color palette dataselected and generated.

BACKGROUND OF THE INVENTION

The creation of digital and non-digital design output using software isdifficult. Various technical fields, such as industrial design,architecture, fashion, interior design, communications, marketing, andthe arts use software to create various digital and non-digital designsand/or design outputs. These design outputs are used in various mediasuch as magazines, newspapers, software applications, and of course, onwebsites on the internet.

Selecting colors and using appropriate colors that are aestheticallypleasing and achieve the desired result in a final artifact or designoutput is difficult. More specifically, once a set of colors is chosento use in a design, such as from a company's existing brand guidelines,a color palette generator, colors extracted from a photo, etc., it isdifficult to decide what objects within a design output should get whichcolors. For example, a website is comprised of dozens or more objectsthat create the entirety of the interface, or the design output.Prescribing colors to every object found in the interface is a tedious,time-consuming and highly specialized creative task. In fields such aswebsite development and design, often it is very difficult to find anaesthetically pleasing color configuration that grabs the attention ofusers. Many websites suffer from disadvantages of having poor colorchoices.

Some existing tools and design software programs provide users aninterface containing a visual of a design output which allows users tomanipulate a single pre-mapped design output's object colors with inputsand toggles. For example, there could be a sample website landing pagein a web browser where the primary blue color can be changed to anycolor the user desires. While it is helpful to visualize howmanipulating a single color will impact the design, it does not aiddesigners or consumers in making the decision on how to apply colorsappropriately. Neither does it provide inspiration for how colors can beused outside of what that user can produce themselves. Users alsostruggle knowing how to react when, after manipulating a single color,find that a separate predefined foreground color now lacks theappropriate contrast with the color just altered. Such tools are foundfrustrating and challenging to non-designers who are not familiar orskilled with aesthetic color design.

Alternatively, many tools offer pre-defined color themes, or sets ofprescriptions on how colors can be applied to a design output globally.This can be very helpful to users who are not skilled in color theorybut these solutions often lack the necessary level of customizationneeded by users. For example, a user might want to create a mobileapplication for an existing business. The interface might expose aselection of color themes to choose from. When selected, all objects arechanged to match the pre-defined color theme. Solutions such as thistypically leave users unsatisfied due to the fact that the they areforced to either settle for a color theme that does not match thecompany's existing brand, or they are compelled to attempt changing allcolor elements themselves, which they are not skilled or equipped to do.Even if the user is equipped and skilled enough to accomplish such atask, it is arduous and requires a lot of time.

Existing tools that help build websites, for example, suffer from thelimitations on the skills of users and do not provide an adequatesolution that allows users to create aesthetically pleasing websitesthat achieve desired results with professional looking color elements.This is because selecting professional-looking colors, or selectingcolors to achieve a specific outcome in the final artifact is a complexprocess and color or color theory is a complex science.

Color may be defined as the characteristic of human visual perceptiondescribed through categorizing those perceptions with names (in English)such as red, blue, yellow, green, orange, purple, and the like. Thishuman color perception is the result of eye cone cell stimulation by aspectrum of electromagnetic radiation called “visible light”.

By scientifically defining a color space or model, colors can beidentified numerically by coordinates or other criteria. For example,the RGB color model corresponds to human trichromacy and the threeprimary cone cell types that respond to three bands of light: longwavelengths, peaking near 564-580 nanometers (red); medium-wavelength,peaking near 534-545 nanometers (green); and short-wavelength light,near 420-440 nanometers (blue). However, there are also popular anddivergent color space models which use more than three color dimensionsin other defined color spaces, such as in the CMYK color model. To add alayer of complexity, besides standard color spaces such as sRGB,proprietary color space systems are also prevalent, such as Adobe® RGB,ProPhoto® RGB, and ColorMatch RGB.

Color science is also called chromatics, or colorimetry; and, includesthe perception of color not just by the human eye but also the brain.Many medical researchers consider the eyes an extension of and integralpart of the brain, and when considered together (eyes and brain) it hasbeen estimated that humans can perceive and distinguish roughlyten-million different “colors”.

A designer having ten-million distinguishable colors with which tocreate a pleasing or inversely a shocking or attention getting interfacemay encounter “a creative problem” when having to pick colors or colorelements for a digital and non-digital design output, and in particulara website or mobile application.

Thus, it is desired to provide a method and system to overcome theabove-mentioned disadvantages in the prior art and to allow users toselect color design elements to create an aesthetically pleasing colorconfiguration that grabs the attention of users for websites, software,and digital and non-digital design outputs.

SUMMARY OF THE INVENTION

It is an object of the invention to provide methods and systems toselect color design elements.

It is an object of the invention to provide methods and systems toselect color design elements that are aesthetically pleasing and achievedesired results.

It is an object of the invention to produce color combinations, orspecific prescriptions of color use in components or objects of a designoutput or final artifact.

It is an object of the invention to determine how, in a variety of ways,colors can be applied to objects in a design output, such as a buttonbackground in a website, text in a social media ad, navigation icons ina software UI, paragraph text in a mobile app UI, and the like.

It is an object of the invention to provide methods and systems toprovide various sets of color design elements or color combinations forvarious output and media.

It is an object of the invention to provide methods of managing colorcombination rules, wherein a user can populate design output componentnames and assign color variables to component names from which colorcombination can be generated.

It is an object of the invention to produce color combinations byreplacing color-palette elements assigned to design output componentnames in a color combination rule with at least one qualifyingcolor-palette element provided to the system and system-generatedcolors, and mapping color combination rule design output component namesto corresponding objects or components in a design output or a finalartifact.

These and other objects of the invention are achieved by providing asystem for producing color-palette data elements for a software program,the system comprising: a processor; and software executing on theprocessor configured to: receive at least one baseline color-paletteelement, calculate color combinations using at least one baselinecolor-palette element, produce a color combination by replacingcolor-palette elements assigned to design output component names in acolor combination rule with at least one qualifying baselinecolor-palette element received by the system, including static colors,system-generated colors, or combinations thereof; map color combinationrule design output component names to corresponding objects orcomponents in a design output; and produce a design output.

In certain embodiments, the software calculates various colorcombinations using the baseline color-palette element by: assigning adigital value to the baseline color-palette element; generating a seriesof color-palette elements having attributes similar to the baselinecolor-palette element; and assigning digital values to the series ofgenerated color-palette elements.

In certain embodiments, the design output includes a series of thedigital values of the generated color-palette elements.

In certain embodiments, the attributes similar to the baseline colorpalette elements includes chroma and/or luma values of the baselinecolor-palette element.

In certain embodiments, the software generates a series of color-paletteelements by: analyzing the chroma and/or luma values of the baselineelement; increasing the chroma and/or luma values by adding white to thebaseline element; and generating at least one color-palette elementhaving a chroma and/or luma value greater than the baseline element.

In certain embodiments, the software generates a series of color-paletteelements by: analyzing the chroma and/or luma values of the baselineelement; decreasing the chroma and/or luma values by adding black to thebaseline element; and generating at least one color-palette elementhaving a chroma and/or luma value less than the baseline element.

In certain embodiments, the software generates a series of color-paletteelements by generating a range of color-palette elements having agreater hue intensity and a lesser hue intensity that the baselinecolor-palette element.

In certain embodiments, the software comprises a rule to generate theseries of color-palette elements, the rule comprising: mapping thechroma and/or luma values of the baseline color-palette elementaccording to a chart from −20 to +20, −20 representing the lightestcolor ranking and +20 representing the darkest color ranging; generatinga series of color-palette elements having chroma and/or luma values thatare within a range of five color rankings.

In certain embodiments, the software receives a second baselinecolor-palette element, wherein the software generates a second series ofdigital values of generated color-palette elements similar to the secondbaseline color-palette element.

In certain embodiments, the system is automatic.

In certain embodiments, the design output is for a software code or fora software program.

In certain embodiments, the design output produced by the system issoftware code, an image, a design file formatted for varioussoftware-based design applications, an animation, a file, instructionson how to design a prescribed color design output, website code and/orstatic media content.

In certain embodiments, the color design output produced by the systemis a modification to an existing color design output.

In certain embodiments, the digital values include hex values, rgbvalues, rgba values, or combinations thereof.

In certain embodiments, the system includes a user interface (UI) or agraphical user interface (GUI).

In certain embodiments, the user interface allows a user to input thebaseline color-palette element.

In certain embodiments, the color provided to the system or method isdefined by a user.

In certain embodiments, the color or colors provided can be any colors.

In certain embodiments, the color or colors provided to the system orinputted into the system is in a digital format, such as a hex value,rgb value, rgba value.

In certain embodiments, the design output is thumbnail representationsof a design output, prescriptive instructions on how to apply colors toan object, computer code, design files, image files, various designoutputs and real-world applications.

In certain embodiments, the design outputs can be rendered and previewedon a digital device, downloaded, or previewed in any way.

In certain embodiments, design outputs are displayed and arranged invarious ways. Such ways comprise by one or more attributes of theoutputs, one or more colors of the outputs, etc.

In certain embodiments, design outputs may or may not include everycolor of the color subset. In certain embodiments, design outputs mayinclude colors not included in the subset.

In certain embodiments, the visual output of color combinations mayinclude information regarding the color contrast of its prescribedforeground and background elements. Such information may be used indetermining the legibility and visibility of a given color combinationoutput's prescription of foreground and background colors within anoutput combination.

In certain embodiments, the system generates a weighted contrast scorerepresentative of the aggregate visibility of the output colorcombination's objects, wherein the score uses the visual contrastcalculation between each of the color combination's objects and theirimmediate parent or background object.

In certain embodiments, the design output results can be filtered bytraits of the system-produced color combinations found in the designoutputs via the interface where the results are displayed.

In certain embodiments, the design output results can be previewed inmore than one embodiment, such as a variety of image thumbnail types.

In certain embodiments, the criteria that dictates which color-paletteelements will qualify for producing a color combination in a designoutput can be customized or changed.

Other objects of the invention are achieved by providing a method of andfor mapping color-palette data elements for a software program, themethod comprising the steps of: receiving a baseline color-paletteelement; calculating various color combinations using the baselinecolor-palette element to create a set of outputs of color-paletteelements; and producing a design output including the set ofcolor-palette elements.

In certain embodiments, the step of calculating comprises: assigning adigital value to the baseline color-palette element; generating a seriesof color-palette elements having attributes similar to the baselinecolor-palette element; and assigning digital values to the series ofgenerated color-palette elements.

In certain embodiments, the design output includes a series of thedigital values of the generated color-palette elements.

In certain embodiments, the step of receiving comprises a series ofquestions relating to color palettes, color application in a specimen,color flows, font preferences, image style preferences, icon stylepreferences, illustration style preferences and a combination thereof.

In certain embodiments, the method involves steps of generating aweighted contrast score representative of the aggregate visibility ofthe output color combination's objects, wherein the score uses thevisual contrast calculation between each of the color combination'sobjects and their immediate parent or background object.

In certain embodiments, the method involves filtering design outputresults by traits of the system-produced color combinations found in thedesign outputs via an interface where the results are displayed.

In certain embodiments, the method involves previewing design outputresults in more than one embodiment, such as a variety of imagethumbnail types.

In certain embodiments, the criteria that dictates which color-paletteelements will qualify for producing a color combination in a designoutput can be customized or changed.

In certain embodiments, the design output is generated in real-time.

In certain embodiments, the design output is code for a website, anemail, a mobile homepage, a user interface (UI), a software program, apitch deck and social ad and a software dashboard, or combinationsthereof.

In certain embodiments, the design output is generated based on rulesusing custom generated color preferences and is not based uponpre-existing templates or previously established colors.

In certain embodiments, the method is dynamic and wherein there aredifferent sets of color-palette data elements presented to the userdepending upon the previous color-palette data elements selected by theuser.

In certain embodiments, the method includes providing an executablesoftware program that performs the method steps.

In certain embodiments, the executable software program contains aninterface, and wherein the interface is manipulated using a togglecontrol or a selector control.

In certain embodiments, the toggle control includes a right down arrowkey, space bar, 4-way joystick.

In certain embodiments, the interface is hosted via a server or on awebsite.

In certain embodiments, the design output is code for a website, codefor an email, a mobile homepage, a pitch deck and social ad and asoftware dashboard, or combinations thereof.

In certain embodiments, the design output is for a user interface (UI).

In certain embodiments, the design output is a software code outputsuitable for a software program.

Other objects of the invention are achieved by providing a method of andfor mapping color-palette data elements for a software program, themethod comprising the steps of: providing an executable software programthat receives a baseline color-palette element; assigning a digitalvalue to the baseline color-palette element; generating a series ofcolor-palette elements having attributes similar to the baselinecolor-palette element; assigning digital values to the series ofgenerated color-palette elements; and producing a design code of theseries of the digital values of the generated color-palette elements.

In certain embodiments, the method involves steps of generating aweighted contrast score representative of the aggregate visibility ofthe output color combination's objects, wherein the score uses thevisual contrast calculation between each of the color combination'sobjects and their immediate parent or background object.

In certain embodiments, the method involves filtering design outputresults by traits of the system-produced color combinations found in thedesign outputs via an interface where the results are displayed.

In certain embodiments, the method involves previewing design outputresults in more than one embodiment, such as a variety of imagethumbnail types.

In certain embodiments, the criteria that dictates which color-paletteelements will qualify for producing a color combination in a designoutput can be customized or changed.

Other objects of the invention are achieved by providing a method of andfor generating color-palette data elements for a software program, themethod comprising the steps of: providing an executable software programwhich presents to and prompts a user to select at least onecolor-palette element from a first set of color-palette elementsdisplayed to the user; wherein upon the user selecting the at least onecolor-palette element within the set, the executable software programthen generates a first value based upon a chroma value and a luma valuecorresponding to the at least one color-palette element; wherein theexecutable software program then generates a second value based upon arule set, the executable software program then compares the first valueand second value and generates a third value based upon the comparison;wherein the executable software program presents to the user forselection a preview of at least one user interface incorporating a thirdset of at color-palette elements based on the third value; whereby upona selection of a preview of at least one user interface incorporating asecond set of at color-palette elements by the user, the executablesoftware program produces software code output in accordance with theuser at least one color-palette data element and the user interfacepreview selections.

In certain embodiments, the method involves steps of generating aweighted contrast score representative of the aggregate visibility ofthe output color combination's objects, wherein the score uses thevisual contrast calculation between each of the color combination'sobjects and their immediate parent or background object.

In certain embodiments, the method involves filtering design outputresults by traits of the system-produced color combinations found in thedesign outputs via an interface where the results are displayed.

In certain embodiments, the method involves previewing design outputresults in more than one embodiment, such as a variety of imagethumbnail types.

In certain embodiments, the criteria that dictates which color-paletteelements will qualify for producing a color combination in a designoutput can be customized or changed.

Other objects of the invention are achieved by providing a method of andfor generating color-palette data elements for a software program, themethod comprising the steps of: present to and prompt a user to selectat least one color-palette element from a first set of color-paletteelements; upon the user selecting the at least one color-palette elementwithin the set, generate a first value based upon a chroma value and aluma value which corresponds to the at least one color-palette element;generate a second value based upon a rule set and compare the firstvalue and second value and generate a third value based upon thecomparison; present to and prompt a user to select a preview of at leastone user interface based upon a third set of at color-palette elementscorresponding to the third value; and produce software code output inaccordance with the user selected at least one color-palette dataelement and the user interface preview.

In certain embodiments, the method involves steps of generating aweighted contrast score representative of the aggregate visibility ofthe output color combination's objects, wherein the score uses thevisual contrast calculation between each of the color combination'sobjects and their immediate parent or background object.

In certain embodiments, the method involves filtering design outputresults by traits of the system-produced color combinations found in thedesign outputs via an interface where the results are displayed.

In certain embodiments, the method involves previewing design outputresults in more than one embodiment, such as a variety of imagethumbnail types.

In certain embodiments, the criteria that dictates which color-paletteelements will qualify for producing a color combination in a designoutput can be customized or changed.

Other objects of the invention are achieved by providing anon-transitory computer readable storage medium storing a computerprogram product for selecting color elements for a software program, thenon-transitory computer readable storage medium comprising: present toand prompt a user to select at least one color-palette element from afirst set of color-palette elements; upon the user selecting the atleast one color-palette element within the set, generate a first valuebased upon a chroma value and a luma value which corresponds to the atleast one color-palette element; generate a second value based upon arule set and compare the first value and second value and generate athird value based upon the comparison; present to and prompt a user toselect a preview of at least one user interface based upon a third setof at color-palette elements corresponding to the third value; andproduce software code output in accordance with the user selected atleast one color-palette data element and the user interface preview.

Other objects of the invention and its particular features andadvantages will become more apparent from consideration of the followingdrawings and accompanying detailed description. It should be understoodthat the detailed description and specific examples, while indicatingthe preferred embodiment of the invention, are intended for purposes ofillustration only and are not intended to limit the scope of theinvention.

BRIEF DESCRIPTION OF THE DRAWINGS

The patent or application file contains at least one drawing executed incolor. Copies of this patent or patent application publication withcolor drawing(s) will be provided by the Office upon request and paymentof the necessary fee.

FIG. 1 is a schematic flowchart of a method of an embodiment of theinvention.

FIG. 2 is a schematic flowchart of a method of an embodiment of theinvention.

FIG. 3 is a schematic flowchart of a method and system of an embodimentof the invention.

FIG. 4 is a chart showing a color matching of an embodiment of theinvention.

FIG. 5 shows various results of the color matching of FIG. 5

FIG. 6 is a chart showing a color matching of an embodiment of theinvention.

FIG. 7 shows various results of the color matching of FIG. 7.

FIG. 8 shows a color grid that enables the mapping of colors across acolor spectrum.

FIG. 9 is a detailed view of the system architecture of an embodiment ofthe invention.

FIG. 10 is a schematic flowchart of a method of an embodiment of theinvention.

FIG. 11 is a schematic flowchart of a method of an embodiment of theinvention.

FIG. 12 is a schematic flowchart of a method to defining and mappingcolor combination object names to design output objects.

FIG. 13 shows an interface where color combination rules are defined andmanaged.

FIG. 14 is a workflow to generate an aggregate contrast score for anoutput color combination.

FIG. 15 shows various results and how an interface can be made todisplay a variety of design output visualizations.

FIG. 16 shows a color combination type filter on a results page.

FIG. 17 shows a contrast score filter on a results page.

FIG. 18 shows various user interactions with a design output in aninterface.

DETAILED DESCRIPTION OF THE INVENTION

This application herein incorporates by reference co-pending U.S.application Ser. No. 15/702,710 entitled “INTELLIGENT SYSTEMS ANDMETHODS OF PRODUCING DIGITAL AND NON-DIGITAL DESIGN OUTPUTS” filed onSep. 12, 2017.

This application herein incorporates by reference U.S. application Ser.No. 15/702,718 entitled “INTELLIGENT SYSTEMS AND METHODS FOR DYNAMICCOLOR HIERARCHY & AESTHETIC DESIGN COMPUTATION” filed Sep. 12, 2017.

In the following description, numerous details are set forth for thepurpose of explanation. However, one of ordinary skill in the art willrealize that the invention may be practiced without the use of thesespecific details.

For ease of understanding and conceptual visualization, the inventivemethod and system is directed to providing methods of dynamic colorhierarchy & aesthetic design computation.

Before this invention, the selection of color design elements andprocess thereof was almost exclusively done by hand. How colors could beapplied to a design output was typically left up to the designer incharge of the design output to 1) conceive possible applications of thecolors and 2) to manually apply the colors to a sample design output inthe ways conceived. This is/was time intensive and often restrictedcreative options due to the laborious nature of the task.

The present invention involves an inventive system and method to assigncolors to produce a design output. In certain embodiments of theinvention, the method and system provides assigning color valueattributes to any color that allow colors to be compared and mappedacross color palettes.

In certain embodiments of the invention, the ability to add N number ofcolor rules so that N possible applications of color for a givenspecimen could be produced, assuming matches to the colors occurs underthe matching acceptance criteria defined in the system is satisfied.

In certain embodiments of the invention, the programmatic comparison ofcolors in a subset to the colors defined in a rule is used to determinepossible applications of color.

In certain embodiments of the invention, the system and method produceshigh-quality design specimens that meet sound visual design standards byusing a system with the ability to define and refine one or more outputacceptance criteria.

In certain embodiments of the invention, the invention limits the manualwork trying to conceive how colors could be applied to a given designspecimen.

In certain embodiments, the system can be applied in a variety ofapplications and use-cases, including stand-alone applications or as apart of an external application.

Method and System for Using Questions to Create Color Output

In certain embodiments, the system provides a means to communicate thesteps and hierarchy of question/topic structures for a given colordesign output to end users.

In certain embodiments, the system and method provides various questionsor topics assist a user in choosing color design preferences for a colordesign output. The system and method creates a color design output,replaces digital assets for a color design output, configures externaltools and resources to support the deployment of a color design output,and/or arranges color design output layouts.

In certain embodiments, the content, the system asks a series ofquestions to a user. In certain embodiments, the order or existence ofsystem-generated questions or topics and their options may be influenceddynamically by previously-satisfied questions or topics provided to theuser.

In certain embodiments, the questions or topics guide users to producinga website or web publishable content.

In certain embodiments, the color input types include an option tocontinue to the next question, a multiple-choice option, a text inputand/or any other input type.

In certain embodiments, the value to satisfy a question or topicprovided by the system for one or more questions or topics aresystem-generated.

In certain embodiments, the system provides a graphical user interface(GUI) that displays one or more topics or questions at a time to a user.

In certain embodiments, satisfying a question or topic automaticallyprogresses the user to the next question or topic.

In certain embodiments, a user can preview options to a question ortopic using a binary toggle and select an option with a selector.

In certain embodiments, the question or topics are satisfied by theinput or selection of a single option from one or more options.

In certain embodiments, the system produces a visual representation ofthe color design output for the purpose of visualizing the context ofone or more color design options for a given topic or question beforeand after a user finalizes on an answer of the question or topic athand.

Progress Indicator

In certain embodiments, the system includes a progress indicator used toshow the color output. The system produces a visual representation ofthe progress of the color design output in real-time as users satisfyeach question or topic.

In certain embodiments, the progress indicator is a visual indicator ofthe progress made. The system provides users with a visual indicator ofthe progress made within a given sub-step or the progress in whole ofgenerating a color design output.

Exemplary Flow

In certain embodiments of the invention, a user will enter a flow andthe following may occur:

-   -   1. User selects a subset of colors.    -   2. Colors are assigned a color value-agnostic color attributes.    -   3. A series of rules were added that:        -   a. Were based on a subset of colors; (and)        -   b. Defined how colors could be applied in a given instance            if comparable color were found in the user's subset of            colors; (and)        -   c. Rule colors were also assigned color value-agnostic color            attributes.    -   4. The color value-agnostic attribute of each color in the        subset of colors to be applied to a design output are compared        to each color value-agnostic attribute of each rule color.    -   5. The system will compute all possible design outputs within        the acceptance parameters defined in the computation process.    -   6. For matches that meet acceptance criteria standards, the        system produces a visual representation of the color application        output within the given design output specimen.    -   7. The system shows all possible color application outputs.    -   8. The system produces a detailed color style guide for the        application of color.    -   9. The system produces design style variable to be applied to        pre-coded web component structures.

Optionally, the user might see a small representation of the finaldesign output respond and change as the user makes selections down theflow.

As depicted in FIG. 1, an embodiment of the inventive method and systemis shown. FIG. 1 shows method (100) including the following steps:receive at least one baseline color-palette element (110); calculatevarious color combinations using the at least one baseline color-paletteelement to create a set of outputs of color-palette elements (120); andproduce a design output including the set of color-palette elements(130).

As depicted in FIG. 10, an embodiment of the inventive method and systemis shown. FIG. 10 shows a method including the following steps: receivecolor(s) (1010); calculate color combination(s) (1020); producecombination with qualifying color(s) (1030); produce design output(s)with color combination (1040); and display results (1050).

As depicted in FIG. 11, an embodiment of the inventive method and systemis shown. FIG. 11 shows the system will receive at least one color(1110). When the system receives at least one color, the color can be inany digital format—hex, rgb, rgba, and the like (1120). The system willcalculate the hue-agnostic color value of the color or colors submittedto the system (1130). The system will query for color combination rules(1140). Each combination rule will have at least one primary color(1150). The system will calculate the hue-agonistic color value of theprimary color or colors associated with at least one color combinationrule (1160). The system will determine if a match is feasible (1170) byverifying that the number of colors received by the system (1120) meetsthe minimum number of colors required by the color combination rule toproduce an output (1175). If the minimum number of colors required isnot satisfied by the color combination rule to produce an output (1176),an output will not be generated by this color combination rule with thesubmitted colors (1120). If the minimum number of colors required issatisfied by the color combination rule to produce an output (1175), thesystem will then compare the hue-agnostic value of the system-receivedcolor(s) (1120) and the hue-agnostic value of the primary color(s)(1160) of the color combination rule (1177). If the hue-agnosticvalue(s) of the received color(s) (1120) and primary color(s) (1170)match (1177), a color combination output can be generated.

Once a color combination output can be generated from a successful match(1170), the instances of the primary colors (1150) within the colorcombination rule (1140) will be replaced (1180) with the baseline coloror colors (1120). Once the primary colors of a color combination ruleare replaced (1180), an output combination is produced (1185). Thesystem will provide a design output or design asset (1190) that will berecolored. The system will map color combination rule object names todesign asset objects and will replace the current design asset's objectcolors (1195) with the correlated colors found in the newly generatedoutput combination (1185). The system will display a visualrepresentation of the results of the recolored design output(s)generated by the system (1196). A design output produced by the systemcan be software code, a software program file, an image, or combinationsthereof.

Color Combination Rules

FIG. 12 is a schematic flowchart of a method to defining and mappingcolor combination object names to design output objects. A user candefine component object names (1221) in a color combination rule (1220)by observing and defining the objects present in a design asset (1210).Once a user defines a set of rule object names (1221) within a colorcombination rule (1220), a user can begin assigning object namesvariable color values (1222). A user can define as many variations ofcolor combination rules (1220) as they would like. When the systemreceives at least one baseline color (1230), and the color or colorsubmitted qualify as a match to at least one color combination rule, theinstances of variable color values (1222) in the color combination rule(1220) are replaced with the mapped baseline color or colors to producea combination output (1240). The system will then map color combinationobjects names to correlating design asset objects and replace thecurrent design asset color values with the newly-generated colorcombination output color values to produce a new design output (1250).

As depicted in FIG. 13, in an embodiment of the invention, an interfacewhere color combination rules are defined and managed is shown. A usercan populate an interface with the object or components names observedin a design asset (1310). A user can assign color variables to objectnames in a color combination rule (1320). The system shows a visual ofthe color combination rule (1330) as a user assigns color variables torule object names.

Various iterations of these steps are possible as set forth in theclaims of the invention.

As shown in FIG. 2, in an embodiment of the invention, a question/answerbased flow is shown. In set (A), the user is prompted with a designquestion. In step (B) the user is presented with customized options. Instep (C) the user selects an option to a design question. Afterwards,the user repeats steps (A)-(C) for all questions in the flow, andafterwards the system produces a final design output based upon theflow.

In certain embodiments, a preview of the final output is generated inreal-time and made visible to the user.

In certain embodiments, the questions include questions relating tocolor palettes, color applications in a specimen, color flows, fontpreferences, icon style preference, illustration style preferences, andthe like.

In certain embodiments, the final output is generated based on rulesusing custom generated design preferences, not on pre-existing templatesor previously established design styles foreign to the user.

In certain embodiments, the interface can be manipulated successfullyguiding users through the flow using on a toggle control and selectorcontrol.

In certain embodiments, such as with step (A), the right down arrow keysare for moving between question design options and the down arrow toselect the option in focus and move to the next question.

In certain embodiments, step (B) involves using a 4-way joystick whereright/left motion moves the user between question/design option and thedown motion selects the option in focus and moves the user to the nextquestion.

In certain embodiments, step (C) involves using the spacebar key incombination with the enter key, where the spacebar key moves the userthrough the question design options and the enter key selects the optionin focus and moves the user to the next design question.

As depicted in FIG. 3 in an embodiment of the invention aquestion/answer based color design flow is shown.

Sources of color palettes are presented to a user for selection (A). Incertain embodiments, the sources of color palettes are generated viacolor palette generator, manually add/selected, colors extracted from animage, colors extracted from a website or combinations thereof.

In step (B), a user selects a subset of colors.

In step (C), selected colors are assigned color value agnosticattributes.

The color value agnostic attributes are compared to a rule set basedupon the selected subset of colors, comparable colors available, and asecond rule created accordingly (D & E).

In Step (F), replacing or updating the second rule set with theresulting color subset and assigning color value agnostic attributes isperformed.

In Steps (G) and H), computing and applying the color value agnosticattributes for and of the resulting color subset to a design outputpreview.

In Step (I), the method involves computing and providing a detailedcolor design guide for the application of color.

In Step (J), the method involves computing and providing a design stylevariable to be applied to pre-coded web component structures.

This inventive color design flow provides the ability to assign colorvalue-agnostic attributes to any color and allows colors to be comparedand mapped across color palettes.

Also, the ability to add N number of color rules so that N possibleapplications of color for a given design may be produced.

The inventive method and system provides and allows for the comparisonof colors in a subset to a color defined in a rule set, to facilitatedetermining possible applications of that color.

The inventive method and system provides and allows for generating allpossible applications of color for a given design from any color subset.

The inventive method and system provides and allows for generatinghigh-quality color designs that meet sound visual design standards bydefining and redefining one or more color output in accordance with arule set criterion.

Process for Matching (Color Combination)

The invention involves a method for computing possible colorcombinations given that the system has one or more color combinationmodels, a method for comparing color values across a color spectrum, anda process to compare a subset of colors to the color combination model.

Steps to generating a color combination model:

A system designed to support the input of a color combination model.

A color combination model is comprised of one or more colors, a designoutput type, granular inputs on assigning colors to a whole or part of asample design output representing a design output type

The ability to add one or more colors.

The ability to apply colors to a sample design output.

The ability to apply various tactics on how one or more colors appliesto a whole or part of a sample design output.

Evaluating Colors Across a Color Spectrum:

The system has defined a color spectrum.

The color spectrum represents a series of colors with a pure value.

The color spectrum is placed on a grid.

The color spectrum grid spans the width of the color spectrum.

The color grid has an x and y axis.

The color grid's x axis is the color spectrum.

The color grid's y axis ranges from 20 to −20.

The values of the y-axis of the color grid 0 represents a pure color.

The values of the y-axis of the color grid of 1 through 20 representadding white to the pure hue at 5% increments until at a value of 20 thecolor on any given x-axis value is white.

The values of the y-axis of the color grid of −1 through −20 representadding black to the pure hue at 5% increments until at a value of −20the color on any given x-axis value is black.

The grid has two parts—one part represents color values, the second partrepresents non-color values or shades of desaturated color, where −20represents black and 20 represent white, where all values between −20and 20 on the non-color portion of the grid represent shades ofdesaturated colors evenly shaded between white (20) down to black (−20).

The system is provided any color value.

The system will them compare the provided color value to all points onthe color grid.

The system will determine which color or non-color value on the colorgrid most closely represents the color being analyzed by the system.

Once the system maps any color value to a color or non-color value onthe color grid, the system will assign the closest color or non-colorvalue to the value being analyzed by the system. If the color beinganalyzed by the system is closest to a value on the color portion of thecolor grid, the color will be assigned a {c,#} coordinate, where the ‘c’represents that the color is closest to a ‘color,’ and the # willrepresent the color's position relative to the color's shade (−19),purity (0), or tone (19). If the color being analyzed by the system isclosest to a value on the non-color portion of the color grid, the colorwill be assigned a {n,#} coordinate, where the ‘n’ represents that thecolor is closest to a non-color, and the # will represent thenon-color's position relative to the non-color's shade (−20), purity(0), or tone (20). This coordinate provides a color value-agnostic valuethat will allow colors from across the spectrum to be compared,regardless of what their individual color is.

Steps to Compare a Subset of Colors to a Color Combination Model:

The system receives one or more colors to analyze.

The system calculates the color grid coordinate for each color.

The system references the color grid coordinates for each color within agiven color combination model.

The system compares color grid coordinates of the colors under analysiswith each of the colors within a given color combination model.

Before an output for a given color combination model can be consideredfor a possible output, these criteria must be met for each colorcombination model:

1. For a given color combination model, there are a certain number ofcolors and non-colors. The subset being analyzed must contain at leastthe same amount or more color values than are contained in a given colorcombination model. If a subset has less colors than a color combinationmodel requires, that color combination model is invalidated and does notproduce a possible output for that color combination model.

2. If the subset does have enough color values to satisfy the colorcombination model, each color must then be within a system-definedminimum distance from the color combination model color value's colorgrid coordinates. If the distance between the color combination modelcolor value's color grid coordinates and the color subset's color gridcoordinates, the color combination model is invalidated and does notproduce an output.

If a color subset has the requisite number of colors and each of thecolor subset value's color grid coordinates meets the minimum distancecriteria as defined by the system relative to each color combinationsubset, the system will identify the given color combination model as acandidate for an output for the color subset under analysis.

The system will then calculate all possible color combination matchesfor a given color combination model. A single color combination modelcan produce more than one color combination output if one or more valuesof a subset meet the criteria for producing an output within a givencolor combination model for various color roles under a colorcombination model.

Once the system computes possible color combinations, the system willthen produce the color combination outputs.

Matching Criteria

In certain embodiments, the system produces color palette elements basedon matching criteria set forth in the color rule data.

One method includes providing any color palette elements from anysource, irrespective of the individual color palette element attributesand then computes possible outcomes by comparing the attributes of thecolor palette element(s) to the attributes of the color palette elementsstored in a color rule. Alternately, the system could produce one ormore color palette elements guaranteed to match the criteria to producean outcome based on the color palette element attributes stored in oneor more color rules.

In certain embodiments, the system and method generates color rulesbased on the programmatic evaluation and extraction of colors and colorapplications from an existing design.

In certain embodiments, the system and method produces a range of colorcombination design outputs in the form of a thumbnail representation orfinal digital output for the purpose of visualizing a color combinationin the context of its final application including but not limited towebsites, blogs, computer software, mobile applications, graphic design,interior designs, architectural designs, flow charts, diagrams,illustrations, icons, brochures, advertisements, print media, digitaladvertisements, presentations, marketing collateral, contracts, emails,business cards, banners, automotive design, civil engineering designs,electrical designs, fashion design, fashion accessory design, motiondesign, construction, culinary arts, set design, stage design, and thelike.

As shown in FIG. 4, the matching criteria is shown based upon a rule.Here, color palette items c-13, c-6, c-1 and c8 are provided. Colors c-6and c-1 are matched with colors c-5 and c-8 respectively. The matchingof these colors generates a thumbnail representation of color as shownin FIG. 4.

A system then selects various colors similar to the matches based upon afirst rule. FIG. 5 shows a set of color matches based upon the firstrule. The rule involves comparing luma and chroma values and findingcolors that are similar to the color table as shown in FIG. 8. Basedupon the rule match, the colors are automatically generated andpresented to a user as a set of color palette options.

The system is able to quickly create these color options, whichaccording to the prior art was difficult and time consuming to create.

FIG. 6 shows a second rule match whereby c-13, c-6, c-1 and c8 areprovided. Colors c-6 and c-1 are matched with colors c-5 and c-8respectively, however, additional black −20 shades were added to thebaseline colors c-6 and c-4, thus affecting the rule.

Based upon the rule, a different color match is provided and FIG. 7shows a set of color matches based upon the second rule as thumbnails toa user. In this embodiment, the background is white, while the colorsare generated to contrast with white and pop based upon the whitebackground.

FIG. 8 shows a color table whereby the values of the y-axis of the colorgrid 0 represents a pure color. The values of the y-axis of the colorgrid of 1 through 20 represent adding white to the pure hue at 5%increments until at a value of 20 the color on any given x-axis value iswhite. The values of the y-axis of the color grid of −1 through −20represent adding black to the pure hue at 5% increments until at a valueof −20 the color on any given x-axis value is black. The grid has twoparts—one part represents color values, the second part representsnon-color values or shades of desaturated color, where −20 representsblack and 20 represent white, where all values between −20 and 20 on thenon-color portion of the grid represent shades of desaturated colorsevenly shaded between white (20) down to black (−20).

Generate a Contrast Score

As depicted in FIG. 14, in an embodiment of the invention, a workflow togenerate an aggregate contrast score for an output color combination isshown. A color combination is under analysis by the system (1410).Output color combination object names are assigned color values (1420).Parent or background objects to all objects in an output colorcombination are defined (1430). In one embodiment of the invention,parent objects are assigned to objects in the color combination outputby a user manually defining parent objects in a color combination rule.In another embodiment of the invention, parent objects are automaticallyassigned to objects in the color combination rule by the systemcalculating the relative position and order of all objects in a space.The contrast between each object and its immediate parent object iscalculated (1440). The overall distribution of contrast score results ofobjects to their immediate parent object is calculated (1450). A final,aggregated score is determined based on the results of the output colorcombination's contrast distribution (1460).

Interacting with Results Produced by the System

As depicted in FIG. 15, in an embodiment of the invention, variousresults and how an interface can be made to display a variety of designoutput visualizations is shown. The system displays the results (1510).A user selects a dropdown displaying alternate visualizations of adesign output (1520). A user selects a single alternate visualizationand the results on a page are updated by the system (1530). A userselects a dropdown displaying alternate mediums and types ofvisualizations of a design output (1540). A user selects a singlealternate visualization and the results on a page are updated by thesystem (1550).

As depicted in FIG. 16, in an embodiment of the invention, a colorcombination type filter on a results page is shown. A user can narrowthe results by a single attribute of the design outputs produced by thesystem.

As depicted in FIG. 17, in an embodiment of the invention, a contrastscore filter on a results page is shown. A user can narrow the resultsby the calculated contrast score of the design outputs produced by thesystem.

As depicted in FIG. 18, in an embodiment of the invention, various userinteractions with a design output in an interface is shown. A user cansee which baseline color or colors were used in the design output(1810). A user can see what type of category a given design output wasassigned by the system (1820). A user can see what the contrast score isof the design output (1830). A user can save a design output (1840). Auser can export or download a design output (1850). A user can select analternate design output medium and type offered by the system (1860).

Computer System & System Architecture

The invention can be implemented in digital electronic circuitry, or incomputer hardware, firmware, software, or in combinations of them.Apparatus of the invention can be implemented in a computer programproduct tangibly embodied in a machine-readable storage device forexecution by a programmable processor; and method steps in the inventioncan be performed by a programmable processor execution a program ofinstructions to perform functions of the invention by operating on inputdata and generating output. The invention can be implementedadvantageously in one or more computer programs that are executable on aprogrammable system including at least one programmable processorcoupled to receive data and instructions from, and to transmit data andinstructions to, a data storage system, at least one input device, andat least one output device. Each computer program can be implemented ina high-level procedural or object-oriented programming language, or in50 assembly or machine language if desired; and in any case, thelanguage can be a compiled or interpreted language.

Suitable processors include, by way of example, both general and specialpurpose microprocessors. Generally, a processor will receiveinstructions and data from a read-only memory and/or a random-accessmemory. Generally, a computer will include one or more mass storagedevices for storing data files; such devices include magnetic disks,such as internal hard disks and removable disks; magneto-optical disks;and optical disks. Storage devices suitable for tangibly embodyingcomputer program instructions and data include all forms of non-volatilememory, including by way of example semiconductor memory devices, suchas EPROM, EEPROM, and flash memory devices; magnetic disks such asinternal hard disks and removable disks; magneto-optical disks; andoptical disks. Any of the foregoing can be supplemented by, orincorporated in, ASICs (application-specific integrated circuits).

FIG. 10 conceptually illustrates a computer system with which someembodiments of the invention are implemented. The computer system 2100includes a bus 2105, a processor 2110, a system memory 2115, a read-onlymemory 2120, a permanent storage device 2125, input devices 2130, andoutput devices 2135. In some embodiments, the computer system alsoincludes a graphic processing unit (GPU) 2175.

The bus 2105 collectively represents all system, peripheral, and chipsetbuses that support communication among internal devices of the computersystem 2100. For instance, the bus 2105 communicatively connects theprocessor 2110 with the read-only memory 2120, the system memory 2115,and the permanent storage device 2125.

From these various memory units, the processor 2110 (also referred to ascentral processing unit or CPU) retrieves instructions to execute anddata to process in order to execute the processes of the invention. Theread-only-memory (ROM) 2120 stores static data and instructions that areneeded by the processor 2110 and other modules of the computer system.

The permanent storage device 2125, on the other hand, is aread-and-write memory device. This device is a non-volatile memory unitthat stores instruction and data even when the computer system 2100 isoff. Some embodiments of the invention use a mass-storage device (suchas a magnetic or optical disk and its corresponding disk drive) as thepermanent storage device 2125. The permanent storage device 2125 may bea fully solid-state storage, a conventional “spinning magnetic pallet”storage (i.e. hard-drive), or combinations thereof.

Other embodiments may use a removable storage device (such as a USBflash drive or SD Memory Card) as a temporary storage or as thepermanent storage device 2125.

Like the permanent storage device 2125, the system memory 2115 is a readand write memory device. However, unlike storage device 2125, the systemmemory is a volatile read-and-write memory, such as a random-accessmemory. The system memory stores at least some of the instructions anddata that the processor needs at runtime.

Instructions and/or data needed to perform processes of some embodimentsare stored in the system memory 2115, the permanent storage device 2125,the read-only memory 2120, or any combination of the three. For example,the various memory units may contain instructions for processingmultimedia items in accordance with some embodiments. From these variousmemory units, the processor 2110 retrieves instructions to execute anddata to process in order to execute the processes of some embodiments.

The bus 2105 also connects to the input and output devices 2130 and2135. The input devices enable the user to communicate information andselect commands to the computer system. The input devices 2130 includealphanumeric keyboards, touch panels, and cursor controllers. The inputdevices 2130 also include scanners through which an image can be inputto the computer system. The output devices 2135 display images generatedby the computer system. The output devices may include printers, penplotters, laser printers, ink-jet plotters, film recorders, and displaydevices, such as cathode ray tubes (CRT), liquid crystal displays (LCD),or electroluminescent displays.

As shown in FIG. 10, bus 2105 also couples computer 2100 to a network2165 through a network adapter (not shown). In this manner, the computercan be a part of a network of computers (such as a local area network(“LAN”), a wide area network (“WAN”), or an Intranet) or a network ofnetworks (such as the Internet). Finally, as shown in FIG. 4, thecomputer system in some embodiments also optionally includes a graphicsprocessing unit (GPU) 2175. A GPU (also referred to as a visualprocessing unit or a display processor) is a dedicated graphicsrendering device which is very efficient in manipulating and displayingcomputer graphics. The GPU can be included in a video card (not shown)or can be integrated into the mother board of the computer system alongwith the processor 2110. Also, the computer system 2100 may be used as apersonal computer, a workstation, a game console, or the like. Any orall of the components of computer system 2100 may be used in conjunctionwith the invention. However, one of ordinary skill in the art willappreciate that any other system configuration may also be used inconjunction with the invention.

By using the term “combinations thereof”, “or combinations thereof”, and“and combinations thereof” in a list, is meant to include variousembodiments, such that certain embodiments include each of the elementsin the list individually, other embodiments included one or more of theelements of the list, and other embodiments include all of the elementsof the list. This is meant to be inclusive such that all possibilitiesof the list individually and in combination are contemplated.

Having thus described several embodiments for practicing the inventivemethod, its advantages and objectives can be understood. Variations fromthe drawings and description can be made by one skilled in the artwithout departing from the scope of the invention, which is to bedetermined from the following claims.

Accordingly, this invention is not to be limited by the embodiments asshown in the drawings and/or as described in the description, sincethese are given by way of example only and not by way of limitation.

What is claimed is:
 1. A system for analyzing color-palette dataelements for producing color combinations in a design output by asoftware program, the system comprising: a processor; and softwareexecuting on the processor configured to: a. receive at least onebaseline color-palette element; b. calculate color combinations using atleast one baseline color-palette element by: assigning a digital valueto the baseline color-palette element; generating a series ofcolor-palette elements having attributes similar to the baselinecolor-palette element; and assigning digital values to the series ofgenerated color-palette elements; c. produce a color combination byreplacing color-palette elements assigned to design output componentnames in a color combination rule with at least one baselinecolor-palette element, the replaced color-palette elements includingstatic colors, system-generated colors, or combinations thereof; and d.produce a design output that contains the color combination thatincludes the at least one baseline color-palette element, wherein thedesign output is software code, a software program file, an image, orcombinations thereof, and wherein the design output includes a series ofthe digital values of the generated color-palette elements.
 2. Thesystem of claim 1, wherein the software executing on the processor isfurther configured to map color combination rule design output componentnames to corresponding objects or components in the design output. 3.The system of claim 1, wherein the attributes similar to the baselinecolor palette elements includes chroma or luma values of the baselinecolor-palette element.
 4. The system of claim 1, wherein the softwaregenerates a series of color-palette elements by: analyzing the chroma orluma values of the baseline element; increasing the chroma or lumavalues by adding white to the baseline element; and generating at leastone color-palette element having a chroma or luma value greater than thebaseline element.
 5. The system of claim 1, wherein the softwaregenerates a series of color-palette elements by: analyzing the chroma orluma values of the baseline element; decreasing the chroma or lumavalues by adding black to the baseline element; and generating at leastone color-palette element having a chroma or luma value less than thebaseline element.
 6. The system of claim 1, wherein the softwaregenerates a series of color-palette elements by generating a range ofcolor-palette elements having a greater hue intensity and a lesser hueintensity than the baseline color-palette element.
 7. The system ofclaim 1, wherein the software comprises a rule to generate the series ofcolor-palette elements, the rule comprising: mapping the chroma or lumavalues of the baseline color-palette element according to a chart from−20 to +20, −20 representing the lightest color ranking and +20representing the darkest color ranging; generating a series ofcolor-palette elements having chroma or luma values that are within arange of five color rankings.
 8. The system of claim 1, wherein thesoftware receives a second baseline color-palette element, wherein thesoftware generates a second series of digital values of generatedcolor-palette elements similar to the second baseline color-paletteelement.
 9. The system of claim 1, wherein the system is automatic. 10.The system of claim 1, wherein the system produces only one designoutput or more than one design output.
 11. The system of claim 1,wherein the system produces the design output as a first-party orthird-party system integration.
 12. The system of claim 1, wherein thesystem generates an aggregate contrast score for the design output. 13.The system of claim 1, wherein the step of receiving comprises a seriesof questions relating to color palettes, color application in aspecimen, color flows, font preferences, image style preferences, iconstyle preferences, illustration style preferences or combinationsthereof.
 14. A computer-implemented method for analyzing color-palettedata elements for producing color combinations in a design output by asoftware program, the method comprising the steps of: providing aprocessor; and software executing on the processor configured to: a.receive at least one baseline color-palette element; b. calculate colorcombinations using at least one baseline color-palette element by:assigning a digital value to the baseline color-palette element;generating a series of color-palette elements having attributes similarto the baseline color-palette element; and assigning digital values tothe series of generated color-palette elements; c. produce a colorcombination by replacing color-palette elements assigned to designoutput component names in a color combination rule with at least onebaseline color-palette element, the replaced color-palette elementsincluding static colors, system-generated colors, or combinationsthereof; and d. produce a design output that contains the colorcombination that includes the at least one baseline color-paletteelement, wherein the design output is software code, a software programfile, an image, or combinations thereof, and wherein the design outputincludes a series of digital values of the generated color-paletteelements.
 15. The computer-implemented method of claim 14, wherein thesoftware executing on the processor is further configured to map colorcombination rule design output component names to corresponding objectsor components in the design output.
 16. The computer-implemented methodof claim 14, wherein the design output is generated in real-time. 17.The computer-implemented method of claim 14, wherein the design outputis generated based on rules using custom generated color preferences andis not based upon pre-existing templates or previously establishedcolors.
 18. The computer-implemented method of claim 14, wherein themethod is dynamic and wherein there are different sets of color-palettedata elements presented to the user depending upon the previouscolor-palette data elements selected by the user.
 19. Thecomputer-implemented method of claim 14, wherein the step of receivingcomprises a series of questions relating to color palettes, colorapplication in a specimen, color flows, font preferences, image stylepreferences, icon style preferences, illustration style preferences orcombinations thereof.